<template>
  <div class="app-wrapper">
    <!-- 头部导航区域 -->
    <header></header>
    <!-- 内容区 -->
    <main>
      <!-- 二级路由区域 -->
      <RouterView />
    </main>
  </div>
</template>

<script lang="ts">
import { defineComponent } from 'vue'
export default defineComponent({
  name: 'HomeView'
})
</script>

<script lang="ts" setup></script>

<style scoped>
/* 固定定位 */
.app-wrapper {
  position: fixed;
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
}

main {
  /* 计算高度 */
  height: calc(100% - 48px);
}
</style>
